<!DOCTYPE html>
<html>

<head>
	<meta charset="utf-8">
	<title>备件</title>
	<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<!--标准mui.css-->
	<link rel="stylesheet" href="../css/mui.min.css">
	<link rel="stylesheet" href="../css/iconfont.css" />
	<!--App自定义的css-->
	<link rel="stylesheet" type="text/css" href="../css/app.css"/>

	<script type="text/javascript" src="../../script/api.js"></script>
	<script type="text/javascript" src="../../html/js/jquery-1.11.3.js"></script>

	<style>

		.title{
			margin: 20px 15px 10px;
			color: #6d6d72;
			font-size: 15px;
		}
		body{
			background: #ffffff;
		}
		html,body{
			width: 100%;
			height: 100%;
			margin: 0;
			padding: 0;
		}
		.mui-content{
			width: 100%;
			height: calc(100% - 110px);
			position: absolute;
			top: 60px;
			margin: 0;
			padding: 0;
		}
		.oa-contact-cell.mui-table .mui-table-cell {
			padding: 11px 0;
			vertical-align: middle;
		}

		.oa-contact-cell {
			position: relative;
			margin: -11px 0;
		}

		.oa-contact-avatar {
			width: 75px;
		}
		.oa-contact-avatar img {
			border-radius: 50%;
		}
		.oa-contact-content {
			width: 100%;
		}
		.oa-contact-name {
			margin-right: 20px;
		}
		.oa-contact-name, oa-contact-position {
			float: left;
		}
		.mui-bar{
			background:#4F77AA ;
			color: #ffffff;
			-webkit-box-shadow: 0 0 1px rgba(0,0,0,0);
			box-shadow: 0 0 1px rgba(0,0,0,0);
		}
		.mui-title{
			color: #ffffff;
		}
		a{
			color:#ffffff;
		}
		.mui-content-title{
			width: 100%;
			height: 80px;
			background: #ffffff;
			color: #666666;
			padding: 15px;
		}
		.mui-content-title .mui-content-title-left{
			width: calc(50% - 1px);
			text-align: center;
			height: 100%;
			float: left;
			border-radius: 10px 0 0 10px;
			background: #EFEFF4;
		}
		.mui-content-title .mui-content-title-right{
			width: calc(50% - 1px);
			height: 100%;
			text-align: center;
			float: right;
			border-radius: 0px 10px 10px 0px;
			background: #EFEFF4;
		}
		.mui-content-title p{
			color: #666666;
			margin: 0;
		}
		.mui-content-title p:first-child{
			color: #000000;
			padding-top: 5px;
		}
		.mui-content-title label.line{
			display: inline-block;
			width: 2px;
			height: 100%;
			background: #bbbbbb;
		}
		.mui-bar-bottom{
			background: #ffffff;
			-webkit-box-shadow: 0 0 1px rgba(0,0,0,0.1);
			box-shadow: 0 0 1px rgba(0,0,0,0.1);
		}
		.mui-content>.mui-table-view:first-child{
			margin-top: 0;
		}
		.clear{
			clear: both;
		}
		.color-primary{
			color: #1ab394;
		}
		.color-success {
			color: #1c84c6;
		}
		.color-info {
			color: #23c6c8;
		}
		.color-warning {
			color: #f8ac59;
		}
		.mui-table-view-cell:after{
			background: #ffffff;
		}
		.mui-table-view:after{
			background: #ffffff;
		}
		.mui-content ul li a span{
			padding-right: 15px;
			font-size: 24px;
			color:#4F77AA ;
		}
		.mui-table-view:before{
			background: #ffffff;
		}
		* { touch-action: none; }
		span#openscan{
			display: inline-block;
			width:60px;
			height:60px;
			text-align: center;
			line-height:60px;
			font-size: 28px;
			border-radius: 50%;
			background: #4F77AA;
			color:#ffffff;
			position: absolute;
			top: -20px;
			right: 50%;
			margin-right: -30px;
		}
	</style>
</head>

<body>
<header class="mui-bar mui-bar-nav">
	<h1 class="mui-title">备件</h1>
</header>

<div class="mui-content">
	<div id="scroll" class="mui-scroll-wrapper">
		<div class="mui-scroll">
			<div class="mui-content-title">
				<div class="mui-content-title-left" id="outof_stock">
					<p>38</p>
					<p>库存不足</p>
				</div>
				<label class="line"></label>
				<div class="mui-content-title-right" id="overstock">
					<p>21</p>
					<p>库存过量</p>
				</div>
			</div>
			<ul class="mui-table-view">
				<li class="mui-table-view-cell">
					<a class="mui-navigate-right" href="../spare_part/sparepartList/sparepart_list.html">
						<span class="icon iconfont icon-ico_jiudianguanli_shebeiweixiudengji"></span>备件列表
					</a>
				</li>
				<li class="mui-table-view-cell" style="border-bottom: 8px solid #EFEFF4;">
					<a class="mui-navigate-right">
						<span class="icon iconfont icon-wenjian"></span>添加备件
					</a>
				</li>
				<li class="mui-table-view-cell">
					<a class="mui-navigate-right" href="../spare_part/historicalOutgoing/outgoing_add.html">
						<span class="icon iconfont icon-chukuguanli"></span>添加出库
					</a>
				</li>
				<li class="mui-table-view-cell">
					<a class="mui-navigate-right">
						<span class="icon iconfont icon-rukuguanli"></span>添加入库
					</a>
				</li>
				<li class="mui-table-view-cell" style="border-bottom: 8px solid #EFEFF4;">
					<a class="mui-navigate-right">
						<span class="icon iconfont icon-baoxiu"></span>添加领用
					</a>
				</li>
				<li class="mui-table-view-cell">
					<a class="mui-navigate-right" href="../spare_part/historicalOutgoing/outgoing_list.html">
						<span class="icon iconfont icon-daochu"></span>历史出库
					</a>
				</li>
				<li class="mui-table-view-cell">
					<a class="mui-navigate-right" href="../spare_part/historicalPutin/putin_list.html">
						<span class="icon iconfont icon-ruku"></span>历史入库
					</a>
				</li>
				<li class="mui-table-view-cell">
					<a class="mui-navigate-right">
						<span class="icon iconfont icon-jihuanengli"></span>备件领用
					</a>
				</li>


			</ul>
		</div>
	</div>
</div>
<nav class="mui-bar mui-bar-tab mui-bar-bottom">
	<a class="mui-tab-item" href="../../index.html">
		<span class="mui-icon mui-icon-home"></span>
		<span class="mui-tab-label">首页</span>
	</a>
	<a class="mui-tab-item" href="equipment.html">
		<span class="mui-icon mui-icon-email fa fa-file-text-o" style="font-size: 20px;"></span>
		<span class="mui-tab-label">设备</span>
	</a>
	<p class="mui-tab-item" href="#">
		<span class="icon iconfont icon-saoyisao" id="openscan"></span>
	</p>
	<a class="mui-tab-item mui-active" href="spare_part.html">
		<span class="mui-icon mui-icon-gear"></span>
		<span class="mui-tab-label">备件</span>
	</a>
	<a class="mui-tab-item" href="my.html">
		<span class="mui-icon mui-icon-contact"></span>
		<span class="mui-tab-label">我的</span>
	</a>
</nav>
</body>
<script src="../js/mui.min.js"></script>
<script>
	mui.init({
		swipeBack:true //启用右滑关闭功能
	});
	mui('body').on('tap','a',function(){
		window.top.location.href=this.href;
	});
	(function($) {
		$('#scroll').scroll({
			indicators: true //是否显示滚动条
		});

		$.init();

	})(mui);
	window.onload=function(){
		var openscan=document.getElementById("openscan");
		openscan.onclick=function(){
			openScan();
		}
	}

	//打开
	function openScan(){

		var FNScanner = api.require('FNScanner');
		FNScanner.open({
			autorotation: true,
			sound:"widget://res/scan.wav"
		}, function(ret, err) {
			if (ret) {
				// alert(JSON.stringify(ret));
				if('success' == ret.eventType){
					var content=ret.content;
					if(content.indexOf("http://")==0 || content.indexOf("https://")==0 || content.indexOf("/sys")==0){
						// window.location.href=content;
						window.location.href="html/public/saoyisao.html?ret="+JSON.stringify(ret);
					}else{
						alert(content);
					}
				}

			} else {
				alert(err.msg);
			}
		});
	}
	$(document).on("click","#outof_stock",function(){
		window.location.href="../spare_part/sparepartList/outof_stock.html";
	})
	$(document).on("click","#overstock",function(){
		window.location.href="../spare_part/sparepartList/overstock.html";
	})
</script>
</html>